<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>Basic Layout - jQuery EasyUI Demo</title>
	<link rel="stylesheet" type="text/css" href="./themes/default/easyui.css">
	<link rel="stylesheet" type="text/css" href="./themes/icon.css">
	<script type="text/javascript" src="./jquery.min.js"></script>
	<script type="text/javascript" src="./jquery.easyui.min.js"></script>
</head>
<body>
	
	<div class="easyui-layout" data-options="fit:true">
		<div data-options="region:'north'" style="height:50px"></div>
		<div data-options="region:'south',split:true" style="height:50px;"></div>
		<div data-options="region:'west',split:true" title="West" style="width:200px;">
			
				<ul id="tt"></ul>

			
		</div>
		<div data-options="region:'center',title:'Main Title',iconCls:'icon-ok'">
			<table id="dg"></table>

		</div>
	</div>

</body>
</html>

<script>
	$('#tt').tree({
	    url:'http://localhost:3000/cate/list/1',
	    method:'get',
	    onClick:function(node){
	    		$('#dg').datagrid({
			    url:'http://localhost:3000/news/list',
			    queryParams:{
			    		cateId:node._id
			    }
			}).datagrid('reload')
	    }
	});
	
	$('#dg').datagrid({
	    url:'http://localhost:3000/news/list',
	    columns:[[
	        {field:'title',title:'title',width:100}
	    ]]
	});


	
</script>